<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      .img {
        width: 40px;
        height: 40px;
      }
    </style>
    <script src="./js/jquery-3.6.0.js"></script>
  </head>
  <body>
    <form action="" method="post">
      编号: <input type="text" value="1001" disabled /> <br />
      用户名:<input type="text" value="zhang3" /> <br />
      密码: <input type="password" value="123" /> <br />
      性别： <input type="radio" name="sex" value="0" checked />男
      <input type="radio" value="1" name="sex" />女 <br />
      爱好: <input type="checkbox" value="CS" />CS
      <input type="checkbox" value="LOL" checked />LOL
      <input type="checkbox" value="DOTA" checked />DOTA <br />
      头像: <input type="file" name="pic" id="" accept="image/*" /> <br />
      地址:
      <select>
        <option value="NJ">南京</option>
        <option value="BJ" selected>北京</option>
        <option value="SH">上海</option>
      </select>
      <br />
      简介: <textarea cols="30" rows="10">个人简介...</textarea> <br />
      <button type="button">测试按钮</button>
    </form>

    <!-- 测试 submit  image form之外 -->
    <button type="submit">提交按钮</button>
    <button type="reset">重置按钮</button>
    <input type="image" src="./images/1.jpg" class="img" />
  </body>
</html>
<script>
  $('button').click(function () {
    console.log(':input===' + $(':input')[0].value)
    console.log(':text===' + $(':text')[0].value)
    console.log(':password===' + $(':password').val())

    console.log(':radio性别===' + $(':radio:checked').val())
    console.log(':checkbox===' + $(':checkbox')[1].value)
    console.log(':submit=========' + $(':submit').text())
    console.log(':reset=========' + $(':reset').text())
    console.log(':button=========' + $(':button').text())
    console.log(':image=========' + $(':image').attr('src'))
    console.log(':file=========' + $(':file').attr('accept'))
    console.log(':file=========' + $(':file').val())
    console.log(':disabled=========' + $(':disabled').val())
    $(':checkbox:checked').each(function (index, ele) {
      console.log('爱好:' + $(ele).val())
    })
    console.log(':selected=========' + $(':selected').val())
    console.log(':info=========' + $('textarea').text())
  })
</script>
